<!-- 个人资料页 -->
<template>
	<view class="my-content"  v-if="formLoading">
		<view class="head">
			<view class="avatar" @click="choose_show=true"> <!-- @click="openAuth('WRITE_EXTERNAL_STORAGE')" -->
				<u-avatar  :src="toImages(avatar)" size="134"></u-avatar>
				<image class="xj" :src='serverImageUrl("/static/images/user/personal/paizhao.png")' mode=""></image>
			</view>
			<u-select v-model="choose_show" :list="chooseList" @confirm="chooseAvatar"></u-select>
		</view>
		<view class="cardBox">
			<buildForm  :formItems="formItems" :value="form" @input="formInput"
				@changeActionSheet="changeActionSheet" />
			<view class="button">
				<u-button :custom-style="{
			        width: '656rpx',
			        height: '63rpx',
			        background: 'linear-gradient(110deg, #DD2910 0%, #F79B29 100%)',
			        'border-radius': '26rpx',
			    }" hover-class="none" type="primary" @click="subForm">
					{{ $t('保存更改') }}
				</u-button>
			</view>

		</view>
		
		<!-- <yk-authpup ref="authpup" type="top" @changeAuth="changeAuth" :permissionID="permissionID"></yk-authpup> -->
		
		<!-- <yk-authpup ref="authpup1" type="top" @changeAuth="changeAuth1" :permissionID="permissionID1"></yk-authpup>
		<yk-authpup ref="authpup2" type="top" @changeAuth="changeAuth2" :permissionID="permissionID2"></yk-authpup> -->
		
		
		<!-- 获取权限的功能 -->
		<Permission></Permission>
	</view>
</template>

<script>
	//import ykAuthpup from "@/components/yk-authpup/yk-authpup";
	
	import {
		IMAGE_URL,
		HTTP_REQUEST_URL
	} from "@/config/app"
	import buildForm from "@/components/buildForm/index.vue"
	import {
		mapForm,
		mapFormItems
	} from 'pages/release/buildFormItems.js'
	import {
		isBase64
	} from "@/common/public";
	import Permission from "@/components/Permission.vue"

	export default {
		components: {
			Permission,buildForm,
			// ykAuthpup
		},
		data() {
			return {
				avatar: '', //头像
				id: 1,
				form: {},
				goods_type_index: 0,
				details: null,
				formLoading: false, // 加载完成后再引入组件
				current: 0,
				categoryList: [],
				user: {}, //个人信息
				
				platform:'',
				permissionID: 'WRITE_EXTERNAL_STORAGE',
				permisesions: [
					{
						key: "WRITE_EXTERNAL_STORAGE",
						value: false
					},{
						key: "CAMERA",
						value: false,
					}
				],
				
				permissionID1: 'CAMERA',
				permissionID2: 'WRITE_EXTERNAL_STORAGE',
				
				choose_show: false,
				chooseList:[
					{
						value: '1',
						label: this.$t('拍摄')
					},
					{
						value: '2',
						label: this.$t('从相册选择')
					}
				],
				formItems: [],
				formItemsConst: [{
						key: "username",
						label: "姓名",
						placeholder: "请输入您的姓名",
						type: "text",
						required: false,
						value: "",
						rules: {},
					},
					{
						key: "country_name",
						label: "国籍",
						placeholder: "国籍",
						type: "disabled",
						required: false,
						value: "",
						rules: {},
					},
					{
						key: "area_id",
						label: "地址",
						placeholder: "城市信息(默认不限)",
						type: "city",
						required: false,
						value: "",
						rules: {},
					},
					{
						key: "mobile",
						label: "手机号",
						placeholder: "请输入您的手机号",
						type: "disabled",
						required: false,
						value: "",
						rules: {},
					},
					{
						key: "email",
						label: "邮箱",
						placeholder: "请输入您的邮箱",
						type: "text",
						required: false,
						value: "",
						rules: {},
					},
					{
						key: "rating",
						label: "综合评价",
						placeholder: "",
						type: "rating",
						required: false,
						value: "",
						rules: {},
					},
					{
						key: "passport_code",
						label: "护照号",
						placeholder: "请输入您的护照号",
						type: "text",
						required: false,
						value: "",
						rules: {},
					},
					{
						key: "profile",
						label: "简介",
						placeholder: "请输入您的简介",
						type: "textarea",
						required: false,
						value: "",
						rules: {},
					},
					{
						key: "fax",
						label: "传真",
						placeholder: "请输入内容",
						type: "text",
						required: false,
						value: "",
						rules: {},
					},
					{
						key: "weblink",
						label: "网站",
						placeholder: "请输入内容",
						type: "text",
						required: false,
						value: "",
						rules: {},
					},
					{
						key: "main_product",
						label: "主营",
						placeholder: "请输入您的主营",
						type: "textarea",
						required: false,
						value: "",
						rules: {},
					},
					{
						key: "passport_image",
						label: "护照",
						placeholder: "",
						type: "images",
						required: false,
						value: [],
						rules: {},
					},
					{
						key: "license_image",
						label: "营业执照",
						placeholder: "",
						type: "images",
						width: 260,
						height: 260,
						required: false,
						value: [],
						rules: {},
					},
					{
						key: "product_image",
						label: "产品图片",
						placeholder: "",
						type: "images",
						width: 260,
						height: 260,
						required: false,
						value: [],
						rules: {},
					},
					{
						key: "shop_image",
						label: "商家图片",
						placeholder: "",
						type: "images",
						width: 550,
						height: 300,
						required: false,
						value: [],
						rules: {},
					},
					{
						key: "buy_videos",
						label: "上传视频",
						placeholder: "",
						type: "videos",
						width: 550,
						height: 300,
						required: false,
						value: [],
						rules: {},
					},
					// {
					//     key: "business_image",
					//     label: "业务图片及视频",
					//     placeholder: "",
					//     type: "files",
					//     required: false,
					//     value: [],
					//     rules: {},
					// },
				]
			};
		},
		onReady() {
			uni.setNavigationBarTitle({
				title: this.$t("个人资料")
			})
		},
		computed: {
			toImages() {
				return (src) => {
					return isBase64(src) ? src : IMAGE_URL + src
				}
			},
		},
		onLoad() {
			this.getUserInfo()
			const systemInfo = uni.getSystemInfoSync();
			const platform = systemInfo.platform;
			this.platform = platform
			if (platform != 'ios') {
				this.requestAndroidPermission('camera')
				this.requestAndroidPermission('photoLibrary')
			}
		},
		methods: {
			async requestAndroidPermission(id) {
				var that = this
				var result = await permision.requestAndroidPermission(id)
				console.log(id,result)
				// if(result!=0){
				// 	for(var i=0;i<that.permisesions.length;i++){
				// 		if(that.permisesions[i].key=='CAMERA'){
				// 			that.permisesions[i].value = true
				// 		}
				// 	}
				// }
			},
			async requestAndroidPermission2(id) {
				var that = this
				var result = await permision.requestAndroidPermission(id)
				console.log(id,result)
				// if(result!=0){
				// 	for(var i=0;i<that.permisesions.length;i++){
				// 		if(that.permisesions[i].key=='WRITE_EXTERNAL_STORAGE'){
				// 			that.permisesions[i].value = true
				// 		}
				// 	}
				// }
			},
			//打开自定义权限目的弹框
			openAuth(permissionID='') {
				//this.openAuth('CAMERA')
				// App.vue里面用新的组件啦
				// if (this.platform != 'ios') {
				// 	const not = this.permisesions.find(item => item.value === false);
				// 	if(not){
				// 		this.permissionID = not.key;
				// 		setTimeout(() => {
				// 			this.$refs['authpup'].open();
				// 		}, 500)
				// 	}
				// }
				//这个是对应的权限 ACCESS_FINE_LOCATION 位置权限 / WRITE_EXTERNAL_STORAGE 存储空间/照片权限 / CAMERA相机权限 / CALL_PHONE 拨打电话
			},
			//用户授权权限后的回调
			changeAuth() {
				const currentPermission = this.permisesions.find(item => item.key === this.permissionID);
				currentPermission.value = true
				//这里是权限通过后执行自己的代码逻辑
				console.log('权限已授权，可执行自己的代码逻辑了');
				this.openAuth()
			},
			
			changeAuth1() {
				console.log('拍摄权限已授权，可执行自己的代码逻辑了');
			},
			
			changeAuth2() {
				console.log('相册权限已授权，可执行自己的代码逻辑了');
			},
			
			
			getUserInfo() {
				const that = this
				that.$u.api.user.getUserInfo().then(res => {
					// 根据国籍判断显示内容
					that.countryItems(res.country.value)
					that.details = res
					that.avatar = res.avatar
					mapFormItems(that.formItems, that.details).then(mapRes => {
						that.formItems = mapRes
						console.log('that.formItems', that.formItems)
						mapForm(that.formItems, that.id).then(formRes => {
							that.form = formRes
							that.formLoading = true
							console.log('that.form', that.form)
						})
					})
					
				}).catch(err => {
					console.log(err)
				})
			},
			countryItems(flag) {
				const that = this
				that.formItems = that.formItemsConst
				if (flag === '0') {
					for (let i = 0; i < that.formItems.length; i++) {
						if (that.formItems[i].key === 'passport_code') {
							that.formItems[i] = {
								key: "idnum",
								label: "身份证号",
								placeholder: "请输入您的身份证号码",
								type: "text",
								required: false,
								value: [],
								rules: {},
							}
						}
						if (that.formItems[i].key === 'passport_image') {
							that.formItems.splice(i, 1)
						}
					}
				}
			},
			subForm() {
				// console.log('form-sub', this.form)
				this.form.avatar = isBase64(this.avatar) ? null : this.avatar
				const that = this
				uni.showLoading({
					title: "Loading...",
					mask: true
				})
				that.$u.api.user.profile(that.form).then(res => {
					uni.hideLoading();
					this.$u.toast(this.$t('操作成功'))
					// setTimeout(() => {
					//     that.$u.route({
					//         url: '/pages/tabbar/user/index',
					//         type: 'switchTab'
					//     })
					// }, 2000)
				}).catch(err => {
					console.log(err)
				})
			},
			formInput(val) {
				this.form = val
			},
			chooseAvatar(e) {
				console.log('chooseAvatar',e);
				let chooseImagetype=''
				if(e[0].value=='1')chooseImagetype='camera'
				if(e[0].value=='2')chooseImagetype='album'
				const that = this
				
				// if(e[0].value=='1'){
				// 	if (this.platform != 'ios') {	
				// 		this.$refs['authpup1'].open();
				// 	}
				// }
				// if(e[0].value=='2'){
				// 	if (this.platform != 'ios') {	
				// 		this.$refs['authpup2'].open();
				// 	}
				// }
				
				
				uni.chooseImage({
					count: 1, 
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: [chooseImagetype], //从相册选择
					success: (chooseImageRes) => {
						const tempFilePaths = chooseImageRes.tempFilePaths;
						uni.uploadFile({
							url: HTTP_REQUEST_URL + '/common/upload', //仅为示例，非真实的接口地址
							filePath: tempFilePaths[0],
							name: 'file',
							formData: {
								'user': 'test'
							},
							success: (uploadFileRes) => {
								uploadFileRes = JSON.parse(uploadFileRes.data)
								that.avatar = uploadFileRes.data.url
								that.subForm()
							}
						});
					}
				});
				// uni.chooseImage({
				// 	success: (chooseImageRes) => {
				// 		const tempFilePaths = chooseImageRes.tempFilePaths;
				// 		uni.uploadFile({
				// 			url: HTTP_REQUEST_URL + '/common/upload', //仅为示例，非真实的接口地址
				// 			filePath: tempFilePaths[0],
				// 			name: 'file',
				// 			formData: {
				// 				'user': 'test'
				// 			},
				// 			success: (uploadFileRes) => {
				// 				uploadFileRes = JSON.parse(uploadFileRes.data)
				// 				that.avatar = uploadFileRes.data.url
				// 				that.subForm()
				// 			}
				// 		});
				// 	}
				// });
			},
			changeActionSheet(val) {
				this.countryItems(val)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.my-content {
		background: #e3eeff;
		height: auto;
	}

	.head {
		width: 100%;
		height: 236rpx;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.cardBox {
		margin: 0 auto;
		// box-shadow: 0 0 10px #ddd;
		background: #fff;
		padding: 10px;
		border-radius: 20rpx;
		background: #fff;
		margin-bottom: 20rpx;
		position: relative;
		width: 90%;
		margin: 0 auto;
	}

	.avatar {
		position: relative;
	}

	.xj {
		width: 50rpx;
		height: 41rpx;
		position: absolute;
		bottom: 0;
		right: 0;
	}

	.u-avatar-demo {
		width: 134rpx;
		height: 134rpx;
		border-radius: 50%;
	}

	.button {
		flex: 1;
		display: flex;
		align-items: flex-end;
		justify-content: center;
		padding-bottom: 26rpx;
	}
</style>